﻿<%@ Page Title="Анкета --- Smart Dating" Language="C#" MasterPageFile="~/Site.Master"
    AutoEventWireup="true" CodeBehind="Personal.aspx.cs" Inherits="WebUI.Personal" ValidateRequest="false" %>

<%@ Import Namespace="WebUI" %>
<%@ Import Namespace="WebUI.SmartDatingRef" %>
<%@ Register Assembly="TabStrip" Namespace="TabStrip" TagPrefix="tc" %>
<asp:Content ID="HeadContents" ContentPlaceHolderID="HeadContent" runat="server">
    <script type="text/javascript" src="Scripts/expando.js"></script>
    <script type="text/javascript" src="Scripts/pwn_css.js"></script>
    <script type="text/javascript" src="Scripts/tiny_mce/jquery.tinymce.js"></script>
    <script type="text/javascript">
        function saveBio() {
            try {
                $("#txtBio").tinymce().save();
            } catch (e) { }
        }
    </script>
    <script type="text/javascript">
        function onPageLoad() {
            // set zodiac sign option
            var zSign = $("#hfZSign")[0].value;
            activateZodiac(zSign);

            // load rich text editor
            $("#txtBio").tinymce({
                script_url: "Scripts/tiny_mce/tiny_mce.js",
                language: "ru",
                theme: "advanced",
                mode: "textareas",
                valid_elements: "strong/b,em/i,br,li,ol,ul,p",
                content_css: "Styles/tiny_mce.css",
                theme_advanced_buttons1: "bold,italic,bullist,numlist,cut,copy,paste,undo,redo",
                theme_advanced_buttons2: "",
                theme_advanced_buttons3: "",
                plugins: "contextmenu"
            });

            // show image for selected options for eyes and hair
            showOptImg("imgEyes", "cboEyeColor", "eyes");
            showOptImg("imgHair", "cboHairColor", "hair");

            // activate "First Name:" field
            $("#txtFirstName").select();
            $("#txtFirstName").focus();
        };

        function showOptImg(imgId, cboId, filenameTemplate) {
            var img = $("#" + imgId)[0];
            var cbo = $("#" + cboId)[0];
            var selValue = cbo.options[cbo.selectedIndex].value;
            if (selValue == -1) {
                img.style.display = 'none';
                return;
            } else {
                img.style.display = 'inline';
            }
            img.src = "Images/" + filenameTemplate + "_" + selValue + ".png";
        }

        function activateZodiac(idx) {
            activateOption("optZodiac_" + idx);
        }

        function setZodiac(idx) {
            $("#hfZSign")[0].value = idx;
        }
    </script>
</asp:Content>
<asp:Content ID="BodyContents" ContentPlaceHolderID="MainContent" runat="server">
    <h1>
        Анкета</h1>
    <div runat="server" id="pnlEntering">
        <div class="short_description">
            <ul>
                <li>Вводите информацию в анкету аккуратно, но сильно.</li>
                <li>Поля, обязательные к заполнению, помечены звездочкой <strong>*</strong>.</li>
            </ul>
        </div>
        <div>
            <span id="errSpan" class="errSpan" runat="server" style="display: none;"></span>
        </div>
        <tc:Expando runat="server" ID="expPassport" IsExpanded="true" Caption="Паспортные данные"
            ExpandedCaptionCssClass="expando_caption expanded" CollapsedCaptionCssClass="expando_caption collapsed"
            ContentsCssClass="expando_contents" CssClass="expando_container">
            <table>
                <tr>
                    <td>
                        Имя <b>*</b>:
                    </td>
                    <td>
                        <input id="txtFirstName" class="doublewide" name="txtFirstName" maxlength="100" runat="server" clientidmode="Static" />
                    </td>
                </tr>
                <tr>
                    <td>
                        Фамилия:
                    </td>
                    <td>
                        <input id="txtLastName" runat="server" name="txtLastName"  maxlength="100" class="doublewide" clientidmode="Static" />
                    </td>
                </tr>
                <tr>
                    <td valign="top">
                        Пол <b>*</b>:
                    </td>
                    <td>
                        <input type="radio" class="styled" runat="server" id="optMale" value="0" name="optGender"
                            clientidmode="Static" />
                        <label for="optMale" style="vertical-align: top;">
                        <img src="Images/gender_0.png"
                                alt="мужской" onclick="activateOption('optMale')" />
                        </label>
                        &nbsp;
                        <input type="radio" class="styled" runat="server" id="optFemale" value="1" name="optGender"
                            clientidmode="Static" />
                        <label for="optFemale" style="vertical-align: top;">
                        <img
                                src="Images/gender_1.png" alt="женский" onclick="activateOption('optFemale')" />
                        </label>
                        &nbsp;
                        <input type="radio" class="styled" runat="server" id="optInter" value="2" name="optGender"
                            clientidmode="Static" />
                        <label for="optInter" style="vertical-align: top;">
                        неопределенный</label>
                    </td>
                </tr>
                <tr>
                    <td>
                        Дата рождения <b>*</b>:
                    </td>
                    <td>
                        <input type="text" runat="server" id="txtDay" name="txtDay" class="microsize_num" />
                        <select id="cboMonth" class="styled thin" runat="server">
                            <option runat="server" value="1">января</option>
                            <option runat="server" value="2">февраля</option>
                            <option runat="server" value="3">марта</option>
                            <option runat="server" value="4">апреля</option>
                            <option runat="server" value="5">мая</option>
                            <option runat="server" value="6">июня</option>
                            <option runat="server" value="7">июля</option>
                            <option runat="server" value="8">августа</option>
                            <option runat="server" value="9">сентября</option>
                            <option runat="server" value="10">октября</option>
                            <option runat="server" value="11">ноября</option>
                            <option runat="server" value="12">декабря</option>
                        </select>
                        <input type="text" runat="server" id="txtYear" name="txtYear" class="microsize_num" />
                        г.
                    </td>
                </tr>
            </table>
        </tc:Expando>
        <tc:Expando runat="server" ID="expPsycho" IsExpanded="true" Caption="Декларация о намерениях"
            ExpandedCaptionCssClass="expando_caption expanded" CollapsedCaptionCssClass="expando_caption collapsed"
            ContentsCssClass="expando_contents" CssClass="expando_container">
            <table>
                <tr>
                    <td>
                        Ориентация <b>*</b>:
                    </td>
                    <td>
                        <select runat="server" class="styled" id="cboOrientation">
                            <option runat="server" value="0">традиционная</option>
                            <option runat="server" value="1">нетрадиционная</option>
                            <option runat="server" value="1">би</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td valign="top">
                        Знак зодиака <b>*</b>:
                    </td>
                    <td id="forZodiac" runat="server">
                        <input type="hidden" runat="server" id="hfZSign" clientidmode="Static" />
                        <input value="0" name="optZodiac" type="radio" id="optZodiac_0" class="styled" onfocus="setZodiac(0)" />
                        <label for="optZodiac_0">
                        <img src="Images/zodiac_0.png" alt="водолей" onclick="activateZodiac(0)" />
                        <span>водолей</span></label>
                        <input value="1" name="optZodiac" type="radio" id="optZodiac_1" class="styled" onfocus="setZodiac(1)" />
                        <label for="optZodiac_1">
                        <img src="Images/zodiac_1.png" alt="рыбы" onclick="activateZodiac(1)" />
                        <span>рыбы</span></label>
                        <input value="2" name="optZodiac" type="radio" id="optZodiac_2" class="styled" onfocus="setZodiac(2)"/>
                        <label for="optZodiac_2">
                        <img src="Images/zodiac_2.png" alt="овен" onclick="activateZodiac(2)" />
                        <span>овен</span></label>
                        <input value="3" name="optZodiac" type="radio" id="optZodiac_3" class="styled" onfocus="setZodiac(3)"/>
                        <label for="optZodiac_3">
                        <img src="Images/zodiac_3.png" alt="телец" onclick="activateZodiac(3)"/>
                        <span>телец</span></label>
                        <br />
                        <input value="4" name="optZodiac" type="radio" id="optZodiac_4" class="styled" onfocus="setZodiac(4)"/>
                        <label for="optZodiac_4">
                        <img src="Images/zodiac_4.png" alt="близнецы" onclick="activateZodiac(4)" />
                        <span>близнецы</span></label>
                        <input value="5" name="optZodiac" type="radio" id="optZodiac_5" class="styled" onfocus="setZodiac(5)"/>
                        <label for="optZodiac_5">
                        <img src="Images/zodiac_5.png" alt="рак" onclick="activateZodiac(5)" />
                        <span>рак</span></label>
                        <input value="6" name="optZodiac" type="radio" id="optZodiac_6" class="styled" onfocus="setZodiac(6)"/>
                        <label for="optZodiac_6">
                        <img src="Images/zodiac_6.png" alt="лев" onclick="activateZodiac(6)" />
                        <span>лев</span></label>
                        <input value="7" name="optZodiac" type="radio" id="optZodiac_7" class="styled" onfocus="setZodiac(7)"/>
                        <label for="optZodiac_7">
                        <img src="Images/zodiac_7.png" alt="дева" onclick="activateZodiac(7)"/>
                        <span>дева</span></label>
                        <br/>
                        <input value="8" name="optZodiac" type="radio" id="optZodiac_8" class="styled" onfocus="setZodiac(8)"/>
                        <label for="optZodiac_8">
                        <img src="Images/zodiac_8.png" alt="весы" onclick="activateZodiac(8)" />
                        <span>весы</span></label>
                        <input value="9" name="optZodiac" type="radio" id="optZodiac_9" class="styled" onfocus="setZodiac(9)"/>
                        <label for="optZodiac_9">
                        <img src="Images/zodiac_9.png" alt="скорпион" onclick="activateZodiac(9)" />
                        <span>скорпион</span></label>
                        <input value="10" name="optZodiac" type="radio" id="optZodiac_10" class="styled" onfocus="setZodiac(10)"/>
                        <label for="optZodiac_10">
                        <img src="Images/zodiac_10.png" alt="стрелец" onclick="activateZodiac(10)" />
                        <span>стрелец</span></label>
                        <input value="11" name="optZodiac" type="radio" id="optZodiac_11" class="styled" onfocus="setZodiac(11)"/>
                        <label for="optZodiac_11">
                        <img src="Images/zodiac_11.png" alt="козерог" onclick="activateZodiac(11)" />
                        <span>козерог</span></label>
                    </td>
                </tr>
                <tr>
                    <td>
                        Цель знакомства <b>*</b>:
                    </td>
                    <td>
                        <select id="cboReason" class="styled" runat="server">
                            <option runat="server" value="0">спонсор</option>
                            <option runat="server" value="1">друг/подруга</option>
                            <option runat="server" value="2">любовница/любовник</option>
                            <option runat="server" value="3">муж/жена</option>
                            <option runat="server" value="4">шофер, батут и клоун</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>
                        Интересы <small>(через запятую)</small>:
                    </td>
                    <td>
                        <input type="text" name="txtInterests" id="txtInterests" class="doublewide" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td valign="top">
                        Кратко о себе:
                    </td>
                    <td>
                        <textarea rows="10" cols="40" name="txtBio" id="txtBio" class="doublewide" runat="server"
                            clientidmode="Static"></textarea>
                    </td>
                </tr>
            </table>
        </tc:Expando>
        <tc:Expando runat="server" ID="expContact" IsExpanded="false" Caption="Контактная информация"
            ExpandedCaptionCssClass="expando_caption expanded" CollapsedCaptionCssClass="expando_caption collapsed"
            ContentsCssClass="expando_contents" CssClass="expando_container">
            <table>
                <tr>
                    <td>
                        <img src="Images/phone.png" alt="тел." />
                        <span style="vertical-align: top;">Телефон:</span>
                    </td>
                    <td>
                        <input id="txtPhone" name="txtPhone" maxlength="20" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <img src="Images/icq.png" alt="ICQ" />
                        <span style="vertical-align: top;">ICQ:</span>
                    </td>
                    <td>
                        <input id="txtICQ" name="txtICQ" maxlength="20" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <img src="Images/jabber.png" alt="тел." />
                        <span style="vertical-align: top;">Jabber:</span>
                    </td>
                    <td>
                        <input id="txtJabber" name="txtJabber"  maxlength="256" runat="server" />
                    </td>
                </tr>
            </table>
        </tc:Expando>
        <tc:Expando runat="server" ID="expPhysical" IsExpanded="false" Caption="Тактико-технические характеристики"
            ExpandedCaptionCssClass="expando_caption expanded" CollapsedCaptionCssClass="expando_caption collapsed"
            ContentsCssClass="expando_contents" CssClass="expando_container">
            <table>
                <tr>
                    <td>
                        Цвет глаз:
                    </td>
                    <td>
                        <img id="imgEyes" alt="Цвет глаз" />
                        <select runat="server" class="styled" id="cboEyeColor" clientidmode="Static" onchange="showOptImg('imgEyes','cboEyeColor','eyes');">
                            <option runat="server" value="-1">- не задан -</option>
                            <option runat="server" value="0">карие</option>
                            <option runat="server" value="1">голубые</option>
                            <option runat="server" value="2">зеленые</option>
                            <option runat="server" value="3">серые</option>
                            <option runat="server" value="4">серо-голубые</option>
                            <option runat="server" value="5">красные</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>
                        Цвет волос:
                    </td>
                    <td>
                        <img id="imgHair" alt="Цвет волос" />
                        <select runat="server" class="styled" id="cboHairColor" clientidmode="Static" onchange="showOptImg('imgHair','cboHairColor','hair');">
                            <option runat="server" value="-1">- не задан -</option>
                            <option runat="server" value="0">блондинко</option>
                            <option runat="server" value="1">брюнетко</option>
                            <option runat="server" value="2">каштановые</option>
                            <option runat="server" value="3">светло-русые</option>
                            <option runat="server" value="4">русые</option>
                            <option runat="server" value="4">рыжие</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>
                        Рост<small>, м</small>:
                    </td>
                    <td>
                        <input id="txtHeight" name="txtHeight" class="halfsize" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td>
                        Вес<small>, кг</small>:
                    </td>
                    <td>
                        <input id="txtWeight" name="txtWeight" class="halfsize" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td>
                        Пропорции <small>(грудь-талия-бедро)</small>:
                    </td>
                    <td>
                        <input id="txtChest" name="txtChest" class="microsize_num" runat="server" />
                        -
                        <input id="txtWaist" name="txtWaist" class="microsize_num" runat="server" />
                        -
                        <input id="txtHip" name="txtHip" class="microsize_num" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td>
                        Главный размер<small>, хм</small>:
                    </td>
                    <td>
                        <select runat="server" class="styled" id="cboMainSize">
                            <option runat="server" value="-1">- не задан -</option>
                            <option runat="server" value="0">экстра кинг сайз</option>
                            <option runat="server" value="1">вэри биг</option>
                            <option runat="server" value="2">медиум</option>
                            <option runat="server" value="3">нормал</option>
                            <option runat="server" value="4">маловато</option>
                        </select>
                    </td>
                </tr>
            </table>
        </tc:Expando>
        <hr />
        <asp:Button runat="server" ID="cmdSave" Text="Сохранить анкету" 
            OnClientClick="saveBio();" UseSubmitBehavior="false" OnClick="cmdSave_Click" />
        <input type="button" value="Отмена" onclick="history.back()" />
    </div>
</asp:Content>
